<template>
  <s-table ref="table" size="default" rowKey="id" :columns="columns" :data="loadData" showPagination="auto">
    <span slot="status" slot-scope="text,scope">
      <a-tag color="green" v-if="scope.taskJson.flow_finish_id == 1">已完成</a-tag>
      <a-tag color="blue" v-else>进行中</a-tag>
    </span>
    
    <span slot="userNames" slot-scope="text">
      <a-tag color="blue" v-for="(it,index) in text" :key="index">{{it}}</a-tag>
    </span>
    <!-- <span slot="name" slot-scope="text, scope">
      <span class="jumpName" @click="handleJump(scope)">{{scope.name}}</span>
    </span> -->
  </s-table>
</template>

<script>
import pick from 'lodash.pick'
import { STable } from '@/components'
import { overdueTaskListStatistics } from '@/api/system'
// 表单字段
const fields = ['id']
const columns = [
  // {
  //   title: '项目ID',
  //   dataIndex: 'projectId',
  // },
  {
    title: '项目',
    dataIndex: 'projectName',
  },
  {
    title: '工作室',
    dataIndex: 'studioName',
  },
  {
    title: '类型',
    width: 80,
    dataIndex: 'module',
    customRender: (text) => text == 'asset' ? '资产' : '镜头',
  },
  {
    title: '信息名称',
    dataIndex: 'cn_name',
    customRender: (text,scope) => scope.infoJson ? scope.infoJson.entity : '--',
  },
  {
    title: '任务',
    dataIndex: 'action',
    customRender: (text,scope) => scope.taskJson ? scope.taskJson.entity : '--',
  },
  {
    title: '制作者',
    width: 100,
    dataIndex: 'userNames',
    scopedSlots: { customRender: 'userNames' },
    // customRender: (text,scope) => scope.taskJson ? scope.taskJson.userNames : '--',
  },
   {
    title: '状态',
    dataIndex: 'status',
    scopedSlots: { customRender: 'status' },
  },
]
export default {
  props: {
    visible: {
      type: Boolean,
      required: true,
    },
    rdata: {
      type: Object,
      required: {},
    },
    type: {
      type: String,
      default: '1',
    },
    rangeTime: {
      type: Array,
      default: null,
    },
  },
  components: {
    STable,
  },
  data() {
    this.columns = columns
    return {
      list: [],
      loading: false,
      parameter: {
        pageNum: 1,
        pageSize: 10,
      },
      init: true,
      loadData: (parameter) => {
        this.loading = true
        // studioId
        // projectId
        const requestParameters = Object.assign({}, this.parameter)
        // this.data,
        console.log(this.rdata,'task.')
        if(!this.rdata.id){
          return false
        }
        if (this.type == '1') {
          requestParameters['studioId'] = this.rdata.id
        } else if (this.type == '2') {
          requestParameters['projectId'] = this.rdata.id
        }else if (this.type == '3') {
          requestParameters['userIds'] = `[${this.rdata.id}]`
        }

        if(this.rangeTime && this.rangeTime){
          requestParameters.startTime = this.rangeTime[0]
          requestParameters.endTime = this.rangeTime[1]
        }
        // requestParameters.type = 1
        console.log(requestParameters)
        return overdueTaskListStatistics(requestParameters).then((res) => {
          this.init = false
          this.loading = false
          let result = {
            data: res.data.data.map(v=>{
              v.taskJson = v.taskJson ? JSON.parse(v.taskJson) : {}
              v.infoJson = v.infoJson ? JSON.parse(v.infoJson) : {}
              return v
            }),
            pageNo: parameter.pageNo,
            pageSize: parameter.pageSize,
            totalCount: res.data.total,
            totalPage: res.data.pages,
          }
          return result
        })
      },
    }
  },
  mounted() {
    // this.$refs.table.refresh()
  },
  methods: {
    handleJump(scope) {
      this.$emit('jump', scope)
    },
  },
  watch: {
    visible: function (n, o) {
      if (n) {
        if (!this.init) {
          this.$refs.table.refresh()
        }
      }
    },
    'rdata.id': function (n, o) {
      console.log(n,'nnn')
      if (n) {
        this.$refs.table.refresh()
      }
    },
    'rangeTime': function (n, o) {
      this.$refs.table.refresh()
    }
  },
}
</script>
<style lang="less" scoped>
.jumpName {
  cursor: pointer;
}
</style>